<style lang="less">
    @import '../../styles/common.less';
    @import '../tables/components/table.less';
</style>
<template>
    <div>
        <Form action="" style="margin: 5px 0;height: 42px;">
            <DatePicker v-model="zcks" type="date" placeholder="请输入开始时间" style="width: 200px"></DatePicker>
            <DatePicker v-model="zcjs" type="date" placeholder="请输入结束时间" style="width: 200px"></DatePicker>
            <FormItem   style="width: 200px;display: inline-block;margin-right: 3px;" >
                <Select  v-model="stats" placeholder="请选择手续费类型"  style="margin-right: 3px;">
                    <Option value="0">全部</Option>
                    <Option value="1">币币卖交易手续费</Option>
                    <Option value="6">币币买交易手续费</Option>
                    <Option value="2">矿机提取释放金手续费</Option>
                    <Option value="4"> 锁仓账户转账手续费</Option>
                    <Option value="5">系统收取费用</Option>
                    <Option value="7">USDI提现手续费</Option>
                    <Option value="8">USDT提现手续费</Option>
                </Select>
            </FormItem>
            <span>USD手续费:{{sum}}</span>
            <span>AITC手续费:{{sum1}}</span>
            <Button type="info"  style="float: right;margin-right: 5px" @click="load">查询</Button>
        </Form>
        <Table  :loading="loading" refs="table1"  :data="Message" :columns="columnsList"></Table>
        <Page :total="pageNum" :page-size="pageSize"  style="text-align: center;margin-top: 15px;" show-total   show-elevator  @on-change="pageChange"></Page>
    </div>
</template>
<script>
    import $http from '../../utils/axiosWrap'
    import canEditTable from '../tables/components/canEditTable.vue'
    export default {
        data() {
            return {
                loading: true,
                Message:[],
                admin:true,
                columnsList: [
                    {
                        title: '序号',
                        width: 80,
                        render: (h, params) => {
                            return  params.index + (this.initPage- 1) * this.pageSize + 1
                        }
                    },
                    {
                        title: 'USD手续费',
                        align: 'center',
                        key: 'feeUSDAmount',
                        editable: true
                    },
                    {
                        title: 'AITC手续费',
                        align: 'center',
                        key: 'feeAITCAmount'
                    },
                    {
                        title: '手续费类型',
                        align: 'center',
                        key: 'feeType'
                    },
                    {
                        title: '时间',
                        align: 'center',
                        key: 'createDate'
                    }
                ],
                name: '',
                phone: '',
                zcks:'',
                zcjs:'',
                num:'',
                sum1:'',
                stats:'',
                pageNum:0,
                initPage:1,
                sum:0,
                pageSize:10
            }
        },
        created: function () {
            this.load()
        },
        methods: {
            handleDel (val, index) {
                this.$Message.success('删除了第' + (index + 1) + '行数据');
            },
            setTime(time){
                var date = new Date(time);
                var month = date.getMonth() + 1
                var day =  date.getDate()
                var hours =   date.getHours()
                var minutes = date.getMinutes()
                var datese = date.getSeconds()
                if(datese /1  < 10){
                    datese = '0' +  datese
                }
                if(month /1  < 10){
                    month = '0' +  month
                }
                if(day /1  < 10){
                    day = '0' +  day
                }
                if(hours /1  < 10){
                    hours = '0' +  hours
                }
                if(minutes /1  < 10){
                    minutes = '0' +  minutes
                }
                return date.getFullYear() + '-' + month + '-' + day
            },
            load (index){
                let _this = this
                let params = new URLSearchParams()
                _this.loading = true
                if(index == '1'){
                    _this.initPage = 1
                }
                params.append('page', _this.initPage)
                if(_this.stats == '0'){
                    _this.stats = ''
                }
                params.append('feeType', _this.stats)
                params.append('pageSize', '10')
                if(_this.zcks){
                    params.append('startDate', _this.setTime(_this.zcks))
                }else{
                    params.append('startDate','')
                }
                if(_this.zcjs){
                    params.append('endDate', _this.setTime(_this.zcjs))
                }else{
                    params.append('endDate','')
                }
                $http.post('/ServiceCharge/selectChargeDetailLogPage',params).then(function (res) {
                    if(res.suc){
                        _this.Message = res.result.list
                        _this.loading = false
                        _this.pageNum = res.result.totalRow
                    }else{
                        if(res.msg == "请先登录"){
                            _this.$Message.error('请重新登录！');
                        }else{
                            _this.$Message.error(res.msg);
                        }
                    }
                })
                $http.post('/ServiceCharge/selectChargeDetailLogTotel',params).then(function (res) {
                    if(res.suc){
                        _this.sum1 = res.result[0].feeAITCAmount
                        _this.sum = res.result[0].feeUSDAmount

                    }else{
                        if(res.msg == "请先登录"){
                            _this.$Message.error('请重新登录！');
                        }else{
                            _this.$Message.error(res.msg);
                        }
                    }
                })
            },
            pageChange(index){
                this.initPage = index
                this.loading = true
                this.load ()
            },
            pageSizes(val){
                this.pageSize = val
                this.loading = true
                this.load(1)
            }
        }
    }
</script>
<style>
</style>

